<template>
    <div class="module_box">

    <div class="module register">
        <div class="trapezoid">
            <div class='l'></div>
            <div class='center'>请注册</div><div class='r'>
        </div>
        </div>
        <ul>
            <li class="tx" @click="imageCheck"><span>
                <img src="https://6269-biyuwu-7gdk3rsjf4cd88b4-1300950401.tcb.qcloud.la/picture/1d623687e950352af5f7f3524443fbf2b3118b63.jpg?sign=9b1f623c0b8a936177e261ab45e602cc&t=1614480687" class="img_tx" alt="">
                <input type="file" hidden id="file_tx" @change="imageCheck2">
            </span></li>
            <li>
                <div class="import">
                    <label for="">名称:</label><br>
                    <input type="text" class="import_input" v-model="registerForm.p_name" @blur="emptyCheck(...arguments,'名称')">
                </div>
                <div class="import">
                    <label for="">用户名:</label><br>
                    <input type="text" class="import_input" v-model="registerForm.p_account" @blur="uniqueCheck">
                </div>
            </li>
            <li>
                <div class="import">
                    <label for="">密&nbsp;&nbsp;码:</label><br>
                    <input type="password" class="import_input" v-model="registerForm.p_password" @blur="emptyCheck(...arguments,'密码')">
                </div>
            </li>
            <li>
                <div class="import">
                    <label for="">请再次输入密码:</label><br>
                    <input type="password" v-model="registerForm.p_password2" @blur="passwordCheck">
                </div>
            </li>
            <li>
                <div class="import">
                    <label for="">学号名:</label><br>
                    <input placeholder="请输入学号+姓名" type="text" class="import_input" v-model="registerForm.p_xhm" @blur="emptyCheck(...arguments,'学号名')">
                </div>
            </li>
            <li>
                <button @click="register">注册</button>
            </li>
        </ul>
    </div>

    </div>
</template>

<script>
    import {alert} from '../../js/entrance/register'
    import $ from 'jquery'
    export default {
        name: "register",
        data(){
            return{
                registerForm:{
                    p_name:'',
                    p_account:'',
                    p_password:'',
                    p_password2:'',
                    p_xhm:'',
                    p_head:'/upload/user_information/tx.jpg',
                },
                p_file:'',
                u:false,
                p:false,
                p2:false,
                xhm:false,
                bug:true
            }
        },
        methods:{
            // 上传头像
            imageCheck(){
              $('#file_tx').click()
            },
            async imageCheck2(){
                this.file = $('#file_tx').get(0).files[0]
                let reader = new FileReader();
                reader.readAsDataURL(this.file)
                reader.onloadend=function (e) {
                    $('.img_tx').attr('src',e.target.result)
                }

                    // await this.$cloudbase.getTempFileURL({
                    //     fileList: ["cloud://gdmecst-test-5rmth.6764-gdmecst-test-5rmth-1300726000/picture/1d623687e950352af5f7f3524443fbf2b3118b63.jpg", "cloud://d/e/f"]
                    // })
                    // .then((res) => {
                    //     console.log(res.fileList);
                    // });

                // let res
                // res = await this.$cloudbase.deleteFile({
                //     fileList:["cloud://gdmecst-test-5rmth.6764-gdmecst-test-5rmth-1300726000/picture/4UWFH`J_CG[M5095%CKU~Y5.png"]
                // })
                // console.log(res)
                // this.file = new File([this.file],'abc'+'.jpg')
                // let formData = new FormData();
                // formData.append('images',this.file)
                // console.log(this.file)

            },
            async emptyCheck(event,text){
                if (!event.target.value){
                    alert(event.path[1],'请输入'+text)
                }else{
                    if (text=='密码'){
                        if(escape(event.target.value).indexOf('%u')>=0) {
                            alert(event.path[1], '不能包含中文！')
                            this.p=false
                        }else{
                            alert(event.path[1],'正确')
                            this.p=true
                        }

                    }else if(text=='学号名'){

                        let _this = this
                        // let res = await this.$cloudbase
                        //     .database()
                        //     .collection('typing_list')
                        //     .where({name:_this.registerForm.p_xhm})
                        //     .get()
                        // if (res.data.length==0){
                        //     alert(event.path[1], '学号名不在名单内！')
                        // }else
                        // {
                            let res = await this.$cloudbase
                                .database()
                                .collection('ykf_student')
                                .where({Student_number:_this.registerForm.p_xhm})
                                .get()
                            if (res.data.length!==0){
                                alert(event.path[1], '该学号名已被注册')
                            } else{
                                alert(event.path[1],'正确')
                                this.xhm=true;
                            }
                        // }
                    }else{
                        alert(event.path[1],'正确')
                    }
                }
            },
            //判断用户是否存在
            async uniqueCheck(event){
                if (!event.target.value){
                    alert(event.path[1],'请输入用户名')
                }else if (escape(event.target.value).indexOf('%u')>=0){
                    alert(event.path[1],'不能包含中文！')
                } else{
                    // alert(event.path[1],'正确')
                    // let _this =this;
                    // let res='';
                    await this.$cloudbase.database()
                        .collection('ykf_student')
                        .where({username:event.target.value})
                        .get()
                        .then((res)=>{
                            if (res.data.length==0){
                                alert(event.path[1],'正确')
                                this.u=true
                            }else{
                                alert(event.path[1],'用户名已存在')
                                this.u=false
                            }
                        })
                    // this.$axios({
                    //     url: '/uniqueCheck',
                    //     method: 'post',
                    //     data: this.registerForm
                    // }).then(res=>{
                    //     if (res.data === 'error') {
                    //         alert(event.path[1],'用户名已存在')
                    //         this.u=false
                    //     }else{
                    //         alert(event.path[1],'正确')
                    //         this.u=true
                    //     }
                    // })
                }

            },
            //判断密码是否相同
            passwordCheck(event){
                if (this.registerForm.p_password!==this.registerForm.p_password2){
                    alert(event.path[1],'两次密码输入不一致')
                    this.p2=false
                }else{
                    alert(event.path[1],'正确')
                    this.p2=true
                }
            },
             async register(){

                if (this.bug) {
                    $('.import_input').each((index, el) => {
                        el.focus()
                        el.blur()
                    })
                    // this.$parent.switchs('login')
                    let _this = this
                    if (!(!this.registerForm.p_name || !this.registerForm.p_account || !this.registerForm.p_password || !this.registerForm.p_password2 === '' || !this.registerForm.p_xhm) && this.u && this.p2 && this.p&&this.xhm) {

                        if ($('#file_tx').get(0).files[0]) {
                            let res = ''
                            res = await this.$cloudbase.uploadFile({
                                cloudPath: "picture/" + this.registerForm.p_account + ".jpg",
                                filePath: $('#file_tx').get(0).files[0]
                            })
                            this.registerForm.p_head = res.fileID
                        } else {
                            this.registerForm.p_head = 'https://6269-biyuwu-7gdk3rsjf4cd88b4-1300950401.tcb.qcloud.la/picture/1d623687e950352af5f7f3524443fbf2b3118b63.jpg?sign=9b1f623c0b8a936177e261ab45e602cc&t=1614480687'
                        }
                        this.bug=false

                        //  // alert('注册成功')
                        await this.$cloudbase
                            .database()
                            .collection('ykf_student')
                            .add({
                                Student_number: this.registerForm.p_xhm,
                                Student_tx: this.registerForm.p_head,
                                name: this.registerForm.p_name,
                                password: this.registerForm.p_password,
                                username: this.registerForm.p_account,
                                admin:false
                            })


                        this.$message({
                            message: '注册成功！',
                            type: 'success'
                        })

                        setTimeout(function () {
                            _this.$parent.switchs('login')
                        }, 1000)
                        await this.$cloudbase
                            .database()
                            .collection('typing')
                            .add({
                                name:this.registerForm.p_xhm,
                                look_ratio:0.0,
                                look_speed:0.0,
                                look_str:"0",
                                look_contest:true,
                                hear_contest:true,
                                hear_ratio:0.0,
                                hear_speed:0.0,
                                hear_str:"0",
                                blind_str:"0",
                                blind_speed:0.0,
                                blind_ratio:0.0,
                                blind_contest:true,
                                contest:false,
                            })
                        await this.$cloudbase
                            .database()
                            .collection('typing_contest')
                            .add({
                                name:this.registerForm.p_xhm,
                                look_ratio:0.0,
                                look_speed:0.0,
                                look_str:"0",
                                look_contest:true,
                                hear_contest:true,
                                hear_ratio:0.0,
                                hear_speed:0.0,
                                hear_str:"0",
                                blind_str:"0",
                                blind_speed:0.0,
                                blind_ratio:0.0,
                                blind_contest:true,
                            })

                    }
                }
            }
        },
        computed:{},
        directives:{
        }
    }
</script>

<style scoped>

</style>